<template>
  <div class="wen-zhang">
    <div class="contain">
      <div class="con-left">
        <div class="play">
          <a href="#">
            <img src="./begin.gif" />
          </a>
        </div>
        <div class="con-z-bottom">
          <div class="register">
            <i class="user-icon"></i>
            <a href>账号注册</a>
          </div>
          <em class="content-icon"></em>
          <div class="xinSh">
            <i class="user-icon"></i>
            <a href>新手引导</a>
          </div>
        </div>
        <div class="QRCode">
          <img src="./QRcode.jpg" alt />
        </div>
        <div class="download">
          <i class="user-icon user-icon_xz"></i>
          <em class="user-icon icon-icon_do"></em>
        </div>
      </div>
      <div class="con-info">
        <div class="caption">
          <h5 class="user-icon user-icon_zx"></h5>
          <p class="crumbs">
            <em class="user-icon user-icon_ling"></em>
            您的位置：
            <!-- <a>{{breadcrumb.trail1.text}}</a>> -->
            <router-link to="/">{{breadcrumb.trail1.text}}</router-link>>
            <a @click="trail2Click()">{{breadcrumb.trail2.text}}</a>
            >{{breadcrumb.trail2.children.text}}
          </p>
        </div>
        <router-view @breadcurmb="breadcrumbTo"></router-view>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      breadcrumb: {
        trail1: {
          path: "/",
          text: "官网首页"
        },
        trail2: {
          path: "/wenZ/tabList",
          text: "游戏公告",
          children: {
            text: "游戏中心"
          }
        }
      }
    };
  },
  created() {
    if (this.$route.query.breadcrumb != undefined) {
      this.breadcrumb = this.$route.query.breadcrumb;
    }
    console.log(this.$route.query.breadcrumb);
  },
  mounted() {
    let back = document.getElementsByClassName("warp")[0];
    let backgroundImage = require("./bg3.jpg");
    back.style.backgroundImage = "url(" + backgroundImage + ")";
    // console.log(this.breadcrumb.trail1);
  },
  methods: {
    trail2Click() {
      console.log(this.breadcrumb.trail2.path);
      switch (this.breadcrumb.trail2.text) {
        case "游戏公告":
          this.breadcrumb.trail2.children.text = "公告列表";
          this.$router.push({
            path: this.breadcrumb.trail2.path
          });
          break;

        default:
          break;
      }
    },
    breadcrumbTo(text, childText, path) {
      let _breadcrumb = this.breadcrumb;
      _breadcrumb.trail2 = {
        path: path,
        text: text,
        children: {
          text: childText
        }
      };
      console.log("123");
      return _breadcrumb;
    }
  }
};
</script>